POUR DUMMIES: une template est une forme, un motif, ou un modèle utilisé comme un guide pour faire quelque chose.
A) TEMPLATE UTILISÉE POUR FICHIERS HTML
Pour créer un modèle HTML, après la construction de la page elle-même, on divise son code html en parties qui peuvent être modifiées, et d'autres qui ne peuvent pas être modifiées.
Ici on vous donne le code nécessaire pour être mis entré les lignes du code de la page et créer une zone éditable.
LISTE 1
On va simuler ici une liste d'une page web, pour individualiser et définir dans les instructions les parties qu'on peut modifier
| Ici on à une partie de code non modifiable entre les TAGs HEAD et / HEAD. Pour créer une zone éditable, qui est une zone ou vous pouvez modifier le code insérez une commande comme ci-dessous |
| Voici la zone ÉDITABLE d'un code, qui doit avoir son propre nom unique. Pour la fermer, vous devriez écrire une commande comme ci-dessous |
| Ici on à un autre code non modifiable entre les TAGs HEAD et / HEAD Rappelez-vous qu'il est possible de définir une zone non modifiable partout - avant et après le texte ou des instructions complètes |
<body>
| Heres a NOT EDITABLE code between BODY and /BODY To create an editable zone, that is a zone you can change the code of, insert a command as below |
| Here's a code's EDITABLE zone, which must have its own unique name To close it you should write a command as below |
| Ici on à une partie de code non modifiable entre les TAGs BODY et / BODY. Pour créer une zone éditable, qui est une zone ou vous pouvez modifier le code insérez une commande comme ci-dessous |
</html>
Cette commande vous permet d'obtenir une page dérivée où vous pouvez modifier le code lorsque vous avez besoin du lay-out pour un'autre nouvelle page .
Du fichier précédent enregistré avec un dwt (template), on peut le sauver comme HTM et obtenir un fichier HTM dérivé en introduisant deux lignes de code.
Le premier va immédiatement après le TAG HTMLet le deuxième est ajouté juste avant le TAG / HTML.
Et voilà le premier problème, parce que vous devez utiliser un éditeur de logiciels spécialisé pour manipuler votre modèle à la fois pour l'attacher à votre nouveau fichier htm ou html. Vous pourriez le faire avec les outils du développeur offertes par les navigateurs. Cependant, je recommande d'utiliser Adobe Dreamweaver, qui met moins de liens au développeur.
À nous DUMMIES je suggére de na pas partir du modèle, mais de cloner fichiers .htm deja prêt à construire vos nouvelles pages:
Pour être en mesure d'appeler le nouveau fichier, vous devez le connecter à un élément de menu, où il faut que au lien soit assigné comme destination la zone où vous souhaitez que la page soit affichée. Prenons un exemple, supposons que vous avez placé dans chaque zone un IFRAME avec le nom donné dans la figure:.
| Top_side | ||
| left_menu | center | right_menu |
| Bot_menu | ||
Supposons d'avoir mis dans la section à gauche (IFRAME 'left_menu') un menu où nous avons les liens qui mènent à défaut sur la partie centrale ('centre' IFRAME). Si nous avons une nouvelle page .htm à mettre dans le centre, il suffit d'ajouter le nom du fichiuer htm dans la zone éditable d'une ligne de la page htm qui est le menu.
Puisque nous avons des modèles standard de cloner pour chaque type de page, à partir de la page d'accueil, dans laquelle nous avons d'abord attribué dans les IFRAMEs les pages initiales des différentes zones, en cliquant sur les liens donnés initiales, nous pouvons de cette manière:
C ) HOW DOES IT WORK HERE
LA CRÉATION D'UN HTML VENANT D'UNE TEMPLATE n'est pas si facile, sauf si vous utilisez un éditeur spécial qui permet au développeur d'appliquer le modèle .dwt et d'enregistrer le dérivé comme un fichier HTM.
Il est plus facile d'obtenir un modèle en utilisant un éditeur spécialisé. Rappelez-vous que l'extension d'une template donné par les différents éditeurs peut n'être pas DWT.
Donc, je vous recommande d'utiliser toujours le même éditeur spécialisé.
Pour un fichier HTML crée à partir du modèle, vous devez l'enregistrer sous son propre nom.
Autrement dit, si vous avez le modèle appelé top_horizontal_ menu.dwt vous pouvez l'appliquer à une page htm vierge en utilisant votre éditeur html spécialisée et ensuite l'enregistrer partout où vous en avez besoin, avec un nom et l'extension .htm ou .html.
On doit toujours vérifier les connexions aux fichiers CSS et scripts, contrôler et d'ajuster les références, si la position est différente de celle du fichier DWT.
Ici, nous avons préparé les pages HTM provenants de modèles préparés par nôtre ami Lino, qu'on peut facilement cloner et utiliser avec un nom différent.
En fait, ces modèles sont conçus de sorte qu'il est permis de changer facilement les liens vers les feuilles de style, de formes et d'autres fichiers.
Bien sûr, vous devez savoir ce que vous voulez et de se préparer en conséquence toutes les pages et les fichiers de liaison pour vos fins, et mis dans vos fichiers tout ce dont vous avez besoin.
EXERCITATION
D ) OUTILS recommandés - minimum nécessaire
Pour créer des sites on a besoin d'outils:
UN éditeur HTML qui doit avoir la capacité de voir le résultat du code que vous écrivez comme vous l'écrivez, et avec une aide contextuelle qui vous permet d'assigner les propriétés de l'objet, d'écrire ou de joindre un ou plusieurs fichiers dans le code CSS ou une chanson. une page, fournissant des alternatives directes à assigner les propriétés spécifique d'un objet.
Il serait autrement assez longue construire des pages Web, même si l'on commence à partir d'un ou plusieurs modèles. En tant que rédacteur, j'ai trouvés très utile DREAMWEAVER par Adobe, car il offre plus de liberté et de facilité pour afficher, modifier, copier et manipuler des fichiers à l'intérieur et l'extérieur du site.
Cependant, je l'ai également essayé d'autres pou de software mais je les ai trouvés difficile et moins intuitifs à utiliser.
L'utilisation de HTML de base est une bonne chose, parce qu'on trouve chaque jour une nouvelle fonctionnalité pour améliorer ses compétences, mais pour l'apprendre vous prendra un lourd travail. Si vous êtes paresseux mieux pas même commencer.
E ) SCHÉMA DU SITE
Avant de passer aux instructions qui nous restent pour installer le site, parlons maintenant de comment sont organisés ses dossiers. Lorsque nous avons téléchargé et décompressé le fichier compressé, par exemple sur le bureau, si nous élargissons les dossiers on va trouver:
| Miosito | Cartella del sito | ||||||
| |--- | index.htm | Fichier de première ouverture | |||||
| |--- | main_framepage_f.htm | Homepage en français | |||||
| |--- | main_framepage_i.htm | Homepage en italien | |||||
| |--- | main_framepage_s.htm | Homepage en espagnol | |||||
| |--- | main_framepage_skem.dwt | Template d'homepage | |||||
| | | |||||||
| |--- | htmpages | Folder des pages html | |||||
| | | | | ||||||
| | | |---- | horizmenus | Folder de Menus Horizontals | ||||
| | | | | ||||||
| | | |---- | simples | Folder de pages sans menu | ||||
| | | | | ||||||
| | | |---- | vertmenus | Folder de menus en colonne | ||||
| | | | | ||||||
| | | |---- | withmenus | pages coulissantes avec Menu au sommet | ||||
| | | |||||||
| | | immagini | Folder des images | |||||
| | | |||||||
| | | stylesheets | Folder des CSS | |||||
| | | |||||||
| |--- | templates | Folder des templates | |||||
Bien sûr, on peut ajouter tous les dossiers que nous voulons et tous les fichiers qu'on va souhaiter en fonction des besoins, duplicats, modèles, htm, et autre encore..